import 'package:fate_blind_box/config/app_style.dart';
import 'package:fate_blind_box/theme/theme_color.dart';
import 'package:fate_blind_box/widget/appbar.dart';
import 'package:fate_blind_box/widget/code_input.dart';
import 'package:fate_blind_box/widget/section_title.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import 'logic.dart';

/// 身份验证
class IdentityVerifyPage extends GetView<IdentityVerifyLogic> {
  const IdentityVerifyPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Colors.white,
        appBar: const HzAppBar(),
        body: _buildUI(context));
  }

  /// 构建UI
  Widget _buildUI(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(top: 12, left: 30, right: 30),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const SectionTitleView(
            '身份验证',
            size: 22,
          ),
          const SizedBox(
            height: 12,
          ),
          Text(
            '为保障账户安全，请输入支付密码验证身份',
            style: TextStyle(
              color: '86909C'.stringToColor,
              fontSize: 13,
              fontWeight: FontWeight.w400,
            ),
          ),
          const SizedBox(
            height: 22,
          ),
          _buildVerificationCodeInputWidget(),
          _buildGetCodeAgainWidget(context),
        ],
      ),
    );
  }

  /// 验证码输入框
  Widget _buildVerificationCodeInputWidget() {
    return CodeInputWidget(
      onSubmitted: controller.verifyPayPassword,
      obscureText: true,
      obscuringCharacter: '·',
    );
  }

  /// 重新获取验证码
  Widget _buildGetCodeAgainWidget(BuildContext context) {
    return GestureDetector(
      onTap: controller.faceVerification,
      child: Padding(
        padding: EdgeInsets.only(top: 13.w),
        child: SizedBox(
          width: double.infinity,
          child: Text(
            '忘记密码',
            textAlign: TextAlign.end,
            style: TextStyle(
              color: ThemeColor.appColor,
              fontSize: 13,
              fontFamily: 'PingFang SC',
              fontWeight: FontWeight.w400,
            ),
          ),
        ),
      ),
    );
  }
}
